<!DOCTYPE html>
<html xmlns:th="www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<meta name="description" content="大学生就业实训,品质就业,职业规划,IT行业人才基地" />
		<title>蜗牛书城(woniuxy.com)-正品低价、品质保障、配送及时、轻松购物！</title>

		<!-- 引入Bootstrap核心样式文件 -->
		<link href="bootstrap-3.4.1/css/bootstrap.min.css" rel="stylesheet">
		<!-- 引入jQuery核心js文件 -->
		<script src="javascript/jQuery-1.12.4.js"></script>
		<!-- 引入BootStrap核心js文件 -->
		<script src="bootstrap-3.4.1/js/bootstrap.min.js"></script>


		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
		<link href="css/common.css" rel="stylesheet" />
		<link href="css/top.css" rel="stylesheet" />
		<link href="css/foot.css" rel="stylesheet" />

		<link href="css/cart.css" rel="stylesheet" />

		<script src="javascript/cart.js"></script>

	</head>

	<body>
		<!--  最顶部的导航栏 -->
		<div class="top-nav">
			<div class="container">
				<div>
					<span class="location-top fl iconfont mr5">&#xe60b;</span>
					<span class="fl mr420">上海</span>
				</div>

				<ul>
					<li><a href="#">我的购物车</a></li>
					<li class="spacer">|</li>
					<li><a href="#">我的订单</a></li>
					<li class="spacer">|</li>
					<li>
						<a href="login.html">你好,请登录</a>
						&nbsp;&nbsp;
						<a class="free-login">免费注册</a>
					</li>
				</ul>
			</div>
		</div>
		<!--  =================== head =============================== -->
		<div class="head">
			<div class="container">
				<!-- ============= logo ============= -->
				<div class="logo fl">
					<h1>
						<a class="hot-word">蜗牛学苑</a>
					</h1>
				</div>
				<!-- ============= 搜索框部份 ============= -->
				<div class="search fl ml100">
					<div class="up">
						<div class="search-box fl mr18">
							<input class="fl" type="text" value="请输入搜索关键字" />
							<span class="photo">&#xe663;</span>
							<span class="search-icon fl">&#xe660;</span>
						</div>

						<div class="cart fl">
							<span class="iconfont">&#xe622;</span>
							<a href="#">我的购物车</a>
							<i class="num">0</i>
						</div>
					</div>

					<div class="navitems">
						<ol>
							<li><a class="red-and-weight" href="#">秒杀</a></li>
							<li><a class="red-and-weight" href="#">优惠券</a></li>
							<li><a href="#">程序设计</a></li>
							<li><a href="#">数据库</a></li>
							<li><a href="#">网络与数据通信</a></li>
							<li><a href="#">科普读物</a></li>
							<li><a href="#">建筑学</a></li>
						</ol>
					</div>

				</div>
			</div>
		</div>

		<!-- ==================== 购物车 ==================== -->
		<div class="container no-padding book-detail-bg">
		</div>

		<div class="index mt50">
			<div class="container no-padding">
				<span class="cart-name">我的购物车</span>
			</div>
		</div>

		<div class="container no-padding">

			<table class="table mt10">
				<tr>
					<td>
						<div class="checkbox">
							<label>
								<input class="all" type="checkbox"> 全选
							</label>
						</div>
					</td>
					<td>
						<div class="checkbox">
							书籍封面
						</div>
					</td>
					<td>
						<div class="checkbox">
							书籍名称
						</div>
					</td>
					<td>
						<div class="checkbox">
							单价
						</div>
					</td>
					<td>
						<div class="checkbox">
							数量
						</div>
					</td>
					<td>
						<div class="checkbox">
							小计
						</div>
					</td>
					<td>
						<div class="checkbox">
							操作
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<input  class="goods" type="checkbox" id="goodId" value="888">
					</td>
					<td>
						<img src="img/01.jpg" />
					</td>
					<td>
						JAVA核心技术卷I
					</td>
					<td class="price">
						20.56
					</td>
					<td>
						<div class="input-group">
							<span class="input-group-addon glyphicon glyphicon-minus"></span>
							<input type="text" class="form-control buy-count" maxlength="3" value="1" >
							<span class="input-group-addon glyphicon glyphicon-plus"></span>
						</div>
					</td>
					<td class="total-price">
						20.56
					</td>
					<td>
						<a class="btn btn-danger remove">删除</a>
					</td>
				</tr>

				<tr>
					<td>
						<input  class="goods" type="checkbox" id="goodId" value="999">
					</td>
					<td>
						<img src="img/01.jpg" />
					</td>
					<td>
						JAVA核心技术卷I
					</td>
					<td class="price">
						50
					</td>
					<td>
						<div class="input-group">
							<span class="input-group-addon glyphicon glyphicon-minus"></span>
							<input type="text" class="form-control buy-count" maxlength="3" value="1" >
							<span class="input-group-addon glyphicon glyphicon-plus"></span>
						</div>
					</td>
					<td class="total-price">
						50
					</td>
					<td>
						<a class="btn btn-danger remove">删除</a>
					</td>
				</tr>



				<tr id="last-tr">
					<td colspan="7" class="no-padding">

						<a href="#">继续购物</a>
						|
						已选择 <span class="choic-num">0</span> 件
						|
						<a href="#">删除所选项</a>


						<a href="#" class="buy btn btn-danger fr ml10" onclick="buyAll()">
							下单
						</a>
						<span class="fr ">合计 : <i class="total">0</i> 元</span>
					</td>
				</tr>
			</table>

		</div>


		<!-- =============== 最后的网站底部 =============== -->
		<div class="container-fluid" id="footer">
			<div class="container">
				<div class="row">
					<div class="col-md-2">
						<dl>
							<dt><b>热线电话</b></dt>
							<dd id="tel"><i>020-000000</i></dd>
							<dd class="openDate">周一至周五9:00-21:00</dd>
							<dd class="openDate">周六至周日9:00-17:30</dd>
							<dd><a href="#">在线客服</a></dd>
						</dl>
					</div>
					<div class="col-md-2">
						<dl>
							<dt><b>服务保障</b></dt>
							<dd><a href="#">正品保证</a></dd>
							<dd><a href="#">7天无理由退换</a></dd>
							<dd><a href="#">退货返运费</a></dd>
							<dd><a href="#">7X15小时客户服务</a></dd>
						</dl>
					</div>
					<div class="col-md-2">
						<dl>
							<dt><b>支付方式</b></dt>
							<dd><a href="#">公司转账</a></dd>
							<dd><a href="#">货到付款</a></dd>
							<dd><a href="#">在线支付</a></dd>
							<dd><a href="#">分期付款</a></dd>
						</dl>
					</div>
					<div class="col-md-2">
						<dl>
							<dt><b>商家服务</b></dt>
							<dd><a href="#">商家信息</a></dd>
							<dd><a href="#">培训中心</a></dd>
							<dd><a href="#">广告服务</a></dd>
							<dd><a href="#">服务市场</a></dd>
						</dl>
					</div>
					<div class="col-md-2">
						<dl>
							<dt><b>物流配送</b></dt>
							<dd><a href="#">免运费</a></dd>
							<dd><a href="#">海外配送</a></dd>
							<dd><a href="#">EMS</a></dd>
							<dd><a href="#">211限时达</a></dd>
						</dl>
					</div>
					<div class="col-md-2">
						<dl>
							<dt><b>关注我们</b></dt>
							<img src="img/code.png">
						</dl>
					</div>
				</div>

			</div>
		</div>
	</body>

</html>
